import { reactive, computed } from "vue";
import { nanoid } from "nanoid";
import store from "@/store/index.js";

import {
  titleHeightratio,
  subtitleHeightratio,
  xLocation,
  getNowTime,
  sizeData,
} from "./index.js";
import { BGM_CONFIG_VOLUM } from "../../../../common/constants/shotstack.js";

export const width = 1080;
export const height = 1920;
export const useWidth = 1080;
// export const useHeight = 2100;

// 变大的比例
export const yRatio = height / height;

// 缩小的比例
export const RatioScale = height / height;

// 缩小的宽度
// export const xRatioScale = (width / useWidth);

// 字体列表
const fontList = computed(() => {
  return store.state.videoMixCut.fontList;
});

// 花字列表
const FlowerArr = computed(() => {
  return store.state.videoMixCut.FlowerArr;
});

// 默认花字列表
const FlowerDefaultArr = computed(() => {
  return store.state.videoMixCut.FlowerDefaultArr;
});

// 阿里云默认花字
const FlowerDefault_Aly = computed(() => {
  return store.state.videoMixCut.FlowerDefault_Aly;
});
// 随机的花字
const defaultFlower = (type) => {
  return FlowerDefaultArr.value[type];
};

// 默认音频配置
const voice_config = computed(() => {
  return store.state.videoMixCut.voice_config;
});

// 推荐的默认音频配置
const volcengine_config = computed(() => {
  return store.state.videoMixCut.volcengine_config;
});

// 默认的音色
const defaultVoiceData = computed(() => {
  return store.state.videoMixCut.defaultVoiceData;
});

// 视频特效配置
export const getEffect_config = () => {
  return {
    isRandom: false, // 开启随机，false 关闭随机，
    // 选择的特效列表
    effects:[]
  }
}

// 字幕特效配置
export const getSubtitleEffect_config = () => {
  return {
    // 入场特效
    AaiMotionInEffect: {
      value: [],
      isRandom: false, // 开启随机，false 关闭随机，
    },
    // 出场特效
    AaiMotionOutEffect: {
      value: [],
      isRandom: false, // 开启随机，false 关闭随机，
    },
    // 循环特效
    AaiMotionLoopEffect: {
      value: [],
      isRandom: false, // 开启随机，false 关闭随机，
    }
}
}

// 获取一个全局标题中的数据
export const baseText_config = () => {
  const find = fontList.value.find((item) => item.id_default == 1);

  console.log(FlowerDefault_Aly.value,'FlowerDefault_Aly');
  
  return {
    text: "",
    flower_id: FlowerDefault_Aly.value?.id || "",
    font_name: find.name,
    font_path: find.material_path,
    material_path: "",
    font_style: find.font_style,
    font_family: find.font_family,
    font_url: find.material_url,
    color: "#ffffff",
    bg_color: "",
    font_size: 24,
    bold: 1,
    italic: 0,
    id: nanoid(),
    x: sizeData.value.draggableWidth / xLocation,
    showX: sizeData.value.draggableWidth / xLocation,
    rightX: sizeData.value.draggableWidth / xLocation,
    y: sizeData.value.draggableHeight / titleHeightratio,
    start_time: 0, //标题开始播放时间（单位：毫秒，音频转字幕时使用）
    alignment: "center",
    underline: 0,
    text_duration: null, //标题持续时长（单位：毫秒）
    // 花字配置
    preset_styles_config: {
      box: 0,
      type: 0,
      id: FlowerDefault_Aly.value?.id || "",
      fontcolor: "",
      bordercolor: "",
      borderw: "",
      boxcolor:  "",
      box_color_alpha: "",
      boxborderw:  "",
      boxradius:"",
    },
    flower_config: {
      type: 0,
      color_main: "",
      color_sub: "",
    },
    // 字幕特效
    subtitle_effects: getSubtitleEffect_config()
  };
};

// 获取一个新的 subtitle 配置
export const baseSubtitle = () => {
  const find = fontList.value.find((item) => item.id_default == 1);
  const findFlowerFont_text = defaultFlower("tts");
  return {
    text: "",
    ssml: "<speak></speak>",
    font_name: find.name,
    font_path: find.material_path,
    material_path: "",
    font_style: find.font_style,
    font_family: find.font_family,
    font_url: find.material_url,
    audio_url: "",
    duration: "",
    font_size: 14,
    flower_id: FlowerDefault_Aly.value?.id || "",
    bg_color: "",
    color: findFlowerFont_text.fontcolor || "#ffffff",
    bold: 0,
    italic: 0,
    x: sizeData.value.draggableWidth / xLocation,
    y: sizeData.value.draggableHeight / subtitleHeightratio,
    showX: sizeData.value.draggableWidth / xLocation,
    rightX: sizeData.value.draggableWidth / xLocation,

    start_time: 0,
    end_time: 0,
    alignment: "center",
    underline: 0,
    subtitle_id: nanoid(),
    preset_styles_config: {
      box: 0,
      type: 0,
      id: FlowerDefault_Aly.value?.id || "",
      fontcolor:"",
      bordercolor:"",
      borderw:  "",
      boxcolor:  "",
      box_color_alpha:  "",
      boxborderw:  "",
      boxradius: "",
    },
    flower_config: {
      type: 0,
      color_main: "",
      color_sub: "",
    },
    elements: [
      {
        type: "text", // type,text-文字，mute-静音,pause-停顿,phoneme-修改发音，number-数字读音
        text: "",
      },
    ]
  };
};

// 获取一个新的 tts配置
export const baseTts_config = () => {
  return {
    tab_id: "text", //配置类型：text-手动设置字幕，audio-音频生成字幕
    tts_id: nanoid(), // tts数组id
    audio_url: "", //音频地址
    img: defaultVoiceData.value.img || "",
    name: defaultVoiceData.value.name || "",
    id: defaultVoiceData.value.id,
    category: defaultVoiceData.value.category,
    tone_id: defaultVoiceData.value.voice_id || "", // 音色id
    emotion_category: "neutral", // 预期情感类型
    emotion_intensity:
      typeof voice_config.value?.intensity?.default == "number"
        ? voice_config.value.intensity.default
        : 100, // 情感程度
    // 字幕格式(多组)
    iccts: [
      {
        elements: [
          {
            type: "text", // type,text-文字，mute-静音,pause-停顿,phoneme-修改发音，number-数字读音
            text: "",
          },
        ],
        start_time: 0, // 字幕开始播放时间（单位：毫秒，音频转字幕时使用）
        end_time: 0, // 字幕播放结束时间（单位：毫秒，音频转字幕时使用）
      },
    ],
    showVoice: true, // 配音设置，true-开，false-关
    showSubtitle: true, // 字幕设置
    speed:
      typeof voice_config.value?.speed?.default == "number"
        ? voice_config.value.speed.default
        : 1, // 语速
    // 推荐的语速
    recommendSpeed:
      typeof volcengine_config.value?.speed?.default == "number"
        ? volcengine_config.value.speed.default
        : 1,
    // 音色类型
    // volume_type: defaultVoiceData.value?.voice_default?.volume_type,
    voice_type:defaultVoiceData.value?.voice_type,
    volume:
      typeof voice_config.value?.volume?.default == "number"
        ? voice_config.value.volume.default
        : 10, // 音量
    duration: "",
    start_time: 0,
    end_time: 0,
    subtitle: [
      {
        ...baseSubtitle(),
      },
    ],
    // 字幕特效
    subtitle_effects: getSubtitleEffect_config(),

  };
};

// 获取视频组中的单个文本标题配置
export const baseTemplateText_config = () => {
  const find = fontList.value.find((item) => item.id_default == 1);
  return {
    text: "",
    flower_id: FlowerDefault_Aly.value?.id || "",
    font_name: find?.name,
    font_path: find.material_path,
    material_path: "",
    font_style: find.font_style,
    font_family: find.font_family,
    font_url: find.material_url,
    color:  "#ffffff",
    bg_color: "",
    font_size: 24,
    bold: 1,
    italic: 0,
    x: sizeData.value.draggableWidth / xLocation,
    showX: sizeData.value.draggableWidth / xLocation,
    y: sizeData.value.draggableHeight / titleHeightratio,
    rightX: sizeData.value.draggableWidth / xLocation,

    start_time: 0, //标题开始播放时间（单位：毫秒，音频转字幕时使用）
    alignment: "center",
    underline: 0,
    id: nanoid(),
    text_duration: null, //标题持续时长（单位：毫秒）
    preset_styles_config: {
      box: 0,
      type: 1,
      id: FlowerDefault_Aly.value?.id || "",
      fontcolor:  "",
      bordercolor:  "",
      borderw:  "",
      boxcolor:  "",
      box_color_alpha:  "",
      boxborderw:  "",
      boxradius:  "",
    },
    flower_config: {
      type: 0,
      color_main: "",
      color_sub: "",
    },
    // 字幕特效
    subtitle_effects: getSubtitleEffect_config()
  };
};

// 获取一个全局字幕配音数据
export const baseGlobal_tts_config = () => {
  return {
    tab_id: "text", //默认是字幕
    img: defaultVoiceData.value.img || "",
    name: defaultVoiceData.value.name || "",
    tone_id: defaultVoiceData.value.voice_id || "", // 音色id
    id: defaultVoiceData.value.id,
    category: defaultVoiceData.value.category,
    emotion_category: "neutral",
    emotion_intensity:
      typeof voice_config.value?.intensity?.default == "number"
        ? voice_config.value.intensity.default
        : 100,
    // 音色类型
    voice_type: defaultVoiceData.value?.voice_type,
    // volume_type: defaultVoiceData.value?.voice_default?.volume_type,
    volume:
      typeof voice_config.value?.volume?.default == "number"
        ? voice_config.value.volume.default
        : 10,
    tts_id: nanoid(),
    iccts: [
      {
        elements: [
          {
            type: "text", // type,text-文字，mute-静音,pause-停顿,phoneme-修改发音，number-数字读音
            text: "",
          },
        ],
        start_time: 0,
        end_time: 0,
      },
    ],
    original_audio_url: "",
    audio_start: "",
    audio_end: "",
    audio_url: "",
    audio_name: "",
    showVoice: true,
    showSubtitle: true,

    speed:
      typeof voice_config.value?.speed?.default == "number"
        ? voice_config.value.speed.default
        : 1,
    // 推荐的语速
    recommendSpeed:
      typeof volcengine_config.value?.speed?.default == "number"
        ? volcengine_config.value.speed.default
        : 1,

    duration: "",
    start_time: 0,
    subtitle: [
      {
        ...baseSubtitle(),
      },
    ],
    // 字幕特效
    subtitle_effects: getSubtitleEffect_config(),
  };
};

// 单项视频组数据
export const base_data = () => {
  return {
    type: 2, // 混剪模式 （0-单镜头混剪【当前镜头组，只挑选一个素材参与视频组合】，2-智能混剪 【当前镜头组的素材将切片后，随机参与视频组合】）
    name: "黄金三秒", // 场景镜头名称
    volume: false, // 素材音量
    // 文本标题配置
    text_config: [
      {
        ...baseTemplateText_config(),
      },
    ],
    // 视频组标题 花字配置
    flower_random_config: {...flower_random_config(), isRandom:false},
    // tts花字配置
    flower_random_tts_config: {...flower_random_config(), isRandom:false},
    tab_id: "text",
    // 字幕和口播配置(多组)
    tts_config: [
      {
        ...baseTts_config(),
      },
      {
        ...baseTts_config(),
        tab_id: "audio",
      },
    ],
    id: nanoid(),
    time_strategy: {
      // 时长设置=>决定镜头组以哪个元素的时长为准
      type: 0, // 时长类型设置：（0-视频原始时长，1-随音频，视频自动变速 ，2-随音频，视频智能截取 ，3-固定时长，智能去重）
      fixed_time: 3000, //类型为 3-固定时长，智能去重 时有效
    },
    // 素材列表
    material_list: [],
    // 特效数据
    effect_config: getEffect_config(),
    // 贴纸数据
    sticker_config:sticker_item()
  };
};

// logo 配置项
export const logo_urls_item = () => {
  return {
    media_id: "",
    url: "",
    x: 10,
    y: 10,
    width: 100,
    height: 100,
    // 时长: 秒, 支持小数点后四位
    duration: 3,
    // 透明度
    opacity:1
  }
} 
// Logo 配置
export const global_logo_config = () => {
  return {
    logo_urls: [
      logo_urls_item()
    ]
  }
}

export const sticker_item = () => {
  const sticker_config = {
    // 贴纸素材
    stickersMaterial: [
    //   {
    //     "width": 511,
    //     "height": 512,
    //     "x": 0,
    //     "y": 0,
    //     "url": "https://vod.jukeyinqing.com/common/sticker/30d919616f8eaa267e49e91a24baa1f7.gif",
    //     "id": 806,
    //     "media_id": "149a4100d3f071ef80b5f6e7d4486301",
    // }
    ],
    // 使用的贴纸, 同一个素材 可能会多次使用
    use_stickers: [
      //   {
      //     "width": 511,
      //     "height": 512,
      //     "x": 0,
      //     "y": 0,
      //     "url": "https://vod.jukeyinqing.com/common/sticker/30d919616f8eaa267e49e91a24baa1f7.gif",
      //     "id": 806,
      //     "media_id": "149a4100d3f071ef80b5f6e7d4486301",
      // }
    ],
    start_time: 0, // 单位 秒
    duration:60, // 单位秒
  }
  return sticker_config
}

// 花字随机配置
export const flower_random_config = () => {
  return {
    isRandom: true,  // true  表示随机花字。
    flower_type: 'effectColor', // system 是我们自己的花字， 'effectColor' 表示是用的阿里云的
    // 随机花字列表
    flower_config_ids:[]
  }
}

// 标题 花字随机配置
export const title_flower_random_config = () => {
  return {
    isRandom: false,  // true  表示随机花字。
    flower_type: 'effectColor', // system 是我们自己的花字， 'effectColor' 表示是用的阿里云的
    // 随机花字列表
    flower_config_ids:[]
  }
}

// 新建的空混剪项数据
export const base_VideoMashup = () => {
  console.log(sizeData.value, "sizeData.value");
  return reactive({
    id: 0,
    // 实际使用
    width: width,
    height: height,
    // 用于手机组件预览展示的缩放比例
    showWidth: width / 4,
    showHeight: height / 4,
    // name: `模板项目${getNowTime()}`, // 项目标题
    name: `模板项目${getNowTime()}`, // 项目标题
    proportion: 0, // 比例类型（0-9:16，1-16:9,2-1:1，3-自定义）
    type: null, // 项目类型（0-剪辑项目，1-模板）
    unique_id: nanoid(), // 项目唯一标识
    tag_id: {}, // array[string]模板绑定标签id
    template_public: 0,
    video_key: "",
    // 镜头内容与配置--即场景内容数组
    resource_data: [
      {
        ...base_data(),
        name: "黄金三秒",
      },
      {
        ...base_data(),
        name: "优势呈现",
      },
      {
        ...base_data(),
        name: "结尾行动号召",
      },
    ],

    // 封面设置
    cover_config: {
      type: 1, // 0-不使用，1-智能生成，2-自定义图片
      material_urls: [],
    },

    // logo
    global_logo_config: global_logo_config(),

    // 背景设置
    background: {
      type: 4, // 4 - 背景虚化
      material_urls: [],
      rgba: "#000000",
    },

    // 背景音量
    bgm_config: {
      type: 1,
      volume: BGM_CONFIG_VOLUM,
      copyright_range: [],
      bgm_list: [],
    },
    // 转场配置
    transition_config: {
      duration: 300,
      type: 0,
      transitions: [],
      global: 0,
    },
    // 滤镜设置
    filter_config: {
      type: 0, // （2-自定义，1-智能匹配，0-未设置）
      filters: [], // 滤镜数组
      global: 0, // global
    },
    effect_type_config: {
      Clip: true,
      Contain: true,
      Flip: false,
      Frame: false,
      Mask: false,
      Speed:false
    },
    // 全局字幕配音
    global_tts_config: {
      type: 0, // 1-使用全局字幕配音，0-不使用全局字幕配音
      isRandom: true, // 是否开启随机声音

      // 花字配置
      flower_random_config: flower_random_config(),
      configs: [
        {
          ...baseGlobal_tts_config(),
          tab_id: "audio",
        },
        {
          ...baseGlobal_tts_config(),
          tab_id: "text",
        },
      ],
      configs_type: "text", // 按钮切换   默认为text    音频为audio
    },
    // 全局标题
    global_text_config: {
      type: 0,
      // 花字配置
      flower_random_config: title_flower_random_config(),
      configs: [
        [
          {
            ...baseText_config(),
          },
        ],
      ],
    },
  });
};
